<template>
  <div class="box">
    <div class="wrapper">
      <ul class="left">
        <li><i class="el-icon-s-home"></i>Shop,Go</li>
        <li @click="goLogin">登录ShopGo</li>
        <li>注册ShopGo</li>
      </ul>
      <ul class="right">
        <li>我的ShopGo</li>
        <li><i class="el-icon-shopping-cart-2"></i>购物车</li>
        <li><i class="el-icon-mobile-phone"></i>手机版</li>
        <li>商家支持</li>
        <li>商家支持</li>
        <li>联系客服</li>
      </ul>
    </div>
  </div>
</template>

<script>
export default {
  name: "Header",
  methods:{
    goLogin(){
      window.open('./login.html')
    }
  }
}
</script>

<style scoped lang="less">
.box {
  background-color: #f2f2f2;

  .wrapper {
    display: flex;
    justify-content: space-between;

    ul {
      padding: 6px 0;

      li {
        display: flex;
        float: left;
        margin-left: 20px;
        margin-right: 20px;

        font-size: 13px;
        line-height: 15px;

        cursor: pointer;
        color: darkgray;

        &:hover {
          color: black;
        }
      }
    }
  }


}
</style>
